<template>
	<view class="selecTemplateOffice" :class="APPTheme">
		<uni-nav-bar fixed status-bar title="选择模板" left-icon="back" :color="APPTheme=='theme-light'?'#000000':'#ffffff'" :background-color="APPTheme=='theme-light'?'#ffffff':'#000000'" @clickLeft="navigatoBack"></uni-nav-bar>
		<!-- 当设置tab-width,指定每个tab宽度时,则不使用flex布局,改用水平滑动 -->
		<!-- <me-tabs v-model="tabIndex" :tabs="tabs" :fixed="false" :tab-width="130"></me-tabs> -->
		<app-tabs v-model="tabIndex" :tabs="tabs" :fixed="false"></app-tabs>
		<swiper :style="{height: height}" :current="tabIndex" @change="swiperChange">
			<!--在线文档 -->
			<swiper-item>
				<mescroll-item :i="0" :index="tabIndex" :tabs="tabs" :filingType="accept.filingType"  :parentId="accept.parentId"></mescroll-item>
			</swiper-item>
			<!-- 在线表格 -->
			<swiper-item>
				<mescroll-item :i="1" :index="tabIndex" :tabs="tabs" :filingType="accept.filingType" :parentId="accept.parentId"></mescroll-item>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	let that
	import {
		mapGetters,
		mapActions
	} from 'vuex'
	import MescrollItem from "./mescroll-swiper-item.vue";
	import AppTabs from "@/components/mescroll-uni/other/app-tabs.vue";
	export default {
		components:{
			AppTabs,
			MescrollItem
		},
		data() {
			return {
				height: "400px", // 需要固定swiper的高度
				tabs: ['在线文档', '在线表格'],
				tabIndex: 0 ,// 当前tab的下标
				wordList:[],
				accept:{//接受到传值
					type:0,//0为word 1为xlx
					filingType:0,//文件柜类型['共享盘', '私人盘', '加密盘'],
					parentId:'',//父文件夹id
				},
			}
		},
		computed: {
			...mapGetters(['APPTheme', 'userInfo', 'api']),
		},
		onLoad(e) {
			that = this
			// 需要固定swiper的高度
			this.height = uni.getSystemInfoSync().windowHeight-100 + 'px'
			that.accept=e
			that.tabIndex=parseInt(e.type)
			uni.$off('sever_Wps')
			uni.$on('sever_Wps',(res)=>{
				setTimeout(()=>{
					uni.showToast({
						title: '文件保存成功',
					});
				},500)
			})
		},
		onShow() {
		},
		methods: {
			// 轮播菜单
			swiperChange(e){
				this.tabIndex = e.detail.current
			},
			//返回事件
			navigatoBack(){
				uni.navigateBack({delta: 1});
				uni.$emit('selecTemplateOfficeBack',true)
			},
		}
	};
</script>

<style scoped lang="scss">
.selecTemplateOffice{
	height: 100%;
}
</style>
